<!DOCTYPE html>
<html>
    <head>

        <meta charset="utf-8">
        <title>Line Chart Template</title>
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1,  minimum-scale=1, maximum-scale=1">
        <link rel="stylesheet" href="/common/css/app.min.css">
        <script src="/common/js/jQuery2.0.2.min.js"></script>
        <script type='text/javascript' src='https://www.google.com/jsapi'></script>
        <!-- script src="../common/js/d3.v3.min.js"></script -->
        <!-- script src="../common/js/main.min.js"></script -->
        <script src="/common/js/charts/TempAndPressure.js"></script>
        <script type='text/javascript'>
            //load the table package
            google.load('visualization', '1.1', {packages: ['table', 'corechart', 'controls']});
            $(document).ready(function() {
                tempLast24Hours();
            });
        </script>

    </head>

    <body>

        <div class="app-wrapper">

            <nav class="main-menu">
                <a href="index.php?page=LiveData">Live View</a>
                <a href="index.php?page=LiveData">Home</a>
                <a href="index.php?page=About">About</a>
            </nav><!--#main-menu-->

            <header>
                <div class="main-menu-button main-menu-button-left"><a class="left-arrow" href="/">&nbsp;</a></div>
                <div class="main-menu-button main-menu-button-right"><a class="gear">&nbsp;</a></div>
                <h1>Live Data</h1>
            </header>

            <div class="app-content">

                <div class="detail-view-header">
                    <div class="content">
                        <h1>Temperatures</h1>
                    </div><!--.content-->
                </div><!--.detail-view-header-->

                <section class="border-bottom">
                    <div class="content padding-bottom-gutter">
                        <h3>Temperatures for the last 7 days</h3>
                        <div id="graph-data-select"></div>
                    </div>
                </section>

                <section>
                    <div class="content">
                        <div id="dashboard" style="position: relative;">
                            <div  id="graph" class="graph" style="height:500px"></div>
                            <div  id="control" class="graph" style="height:100px"></div>
                        </div>
                    </div><!-- .content -->
                </section>

            </div><!--#app-content-->
        </div><!--#app-wrapper-->


    </body>
</html>
